<template>
	<view class="status_bar">
		<!-- 这里是状态栏 -->
	</view>
	<view class="details">
		<uni-nav-bar :border="false" left-icon="left" right-icon="trash-filled" @clickLeft="back"
			@clickRight="deleteFn">
			<view class="title">
				<text class="text">明细详情</text>
			</view>
		</uni-nav-bar>
		<view class="details-content">
			<view class="details-item">
				<text>类型</text>
				<text>{{form.expenditureItem}}</text>
			</view>

			<view class="details-item">
				<text>资产账户</text>
				<text>{{form.assetsName}}</text>
			</view>

			<view class="details-item">
				<text>金额</text>
				<text>￥{{form.expenditureAmount}}</text>
			</view>

			<view class="details-item">
				<text>账本</text>
				<text>{{form.accountBookName}}</text>
			</view>

			<view class="details-item">
				<text>时间</text>
				<text>{{form.expenditureTime}}</text>
			</view>

			<view class=" remark">
				<text>备注</text>
				<view class="remark-content"> {{form.remarks}}</view>
			</view>
		</view>

		<view class="save-btn" @click="goTo">
			<text class="save-btn-text">编辑</text>
		</view>

		<uni-popup ref="alertDialogRef" type="dialog">
			<uni-popup-dialog type="error" cancelText="关闭" confirmText="同意" title="提示" :content=" messageText "
				@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
		</uni-popup>

	</view>



</template>

<script lang="ts" setup>
	import { ref } from 'vue';
	import { onShow, onLoad } from '@dcloudio/uni-app'
	import { userStore } from '@/store/user'
	import { expenditureLedgerApi, incomeLedgerApi } from '@/apis/apis';



	const form = ref({
		current: 0,//临时
		accountBookName: null,
		accountBookId: null,
		"accounting": null,
		"assetsId": null,
		assetsName: null,
		"deleted": null,
		"deletedTime": null,
		id: null,
		"invoiceStatus": null,
		// "params": {},
		"quantity": null,
		remarks: null,
		"unitPrice": null,
		userId: null,
		// 以下是差异字段
		"expenditureAmount": null,
		"expenditureItem": null,
		"expenditureItemId": "",
		"expenditureTime": null,
		"expenditureType": null,
	})

	let options : any = {
		type: '',
		id: ''
	}

	onLoad((o : any) => {
		options = o

	})

	onShow(() => {
		getDetail(options.type, options.id)
	})

	const dialogConfirm = async () => {
		let res : any = null
		if (options.type == 0) {
			res = await expenditureLedgerApi.deleteByIdsUsingDELETE({
				idList: form.value.id
			})
		} else {
			res = await incomeLedgerApi.deleteByIdsUsingDELETE_1({
				idList: form.value.id
			})
		}

		if (res.code === 200) {
			uni.showToast({ title: res.msg, icon: 'success' });
			back()
		}
	}
	const messageText = `是否删除！`
	const alertDialogRef = ref(null)
	const deleteFn = () => {
		alertDialogRef.value.open()
	}

	const dialogClose = () => {
		alertDialogRef.value.close()
	}

	const back = () => {
		uni.navigateBack()
	}




	const getDetail = async (type : any, id : string) => {
		let res : any = null

		if (type == 0) {
			res = await expenditureLedgerApi.queryPageUsingPOST_4({
				id: id
			})
		} else {
			res = await incomeLedgerApi.queryPageUsingPOST_6({
				id: id
			})
		}
		if (res.code == 200) {
			form.value = res.data.records[0]

			form.value.current = type == 0 ? 0 : 1
		}
	}
	const goTo = () => {
		userStore.setCurrentExpenditur(form.value)
		uni.navigateTo({
			url: `/pages/startKeepingAccounts/startKeepingAccounts?pageType=edit`
		})
	}
</script>

<style lang="scss" scoped>
	$nav-height: 44px;

	.details {
		padding: 20px;

		.title {
			width: 100%;

			text-align: center;
			height: $nav-height;
			line-height: $nav-height;

			.text {
				font-size: 16px;
			}
		}


	}

	.details-content {
		padding: 20px;
		border-radius: 8px;
		border: 1px solid #767676;

		.details-item {
			padding: 20px 10px;
			display: flex;
			justify-content: space-between;
			border-bottom: 1px solid #acacac;


		}

		.remark {
			padding: 20px 10px;

			.remark-content {
				margin-top: 10px;
			}
		}
	}
</style>